<!DOCTYPE html>
<html lang="en">
    <head>
	    <meta charset="utf-8">
	    <title>后台管理系统</title>
	    <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
	    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	    <meta name="description" content="">
	    <meta name="author" content="">
	    {load href="/static/css/bootstrap.css" /}
	    {load href="/static/css/theme.css" /}
	    {load href="/static/css/font-awesome.css" /}
	    {load href="/static/js/jquery-1.7.2.min.js" /}
	    {load href="/static/js/laydate.js" /}
	    <!-- Demo page code -->
	    <style type="text/css">
	        #line-chart {
	            height:300px;
	            width:800px;
	            margin: 0px auto;
	            margin-top: 1em;
	        }
	        .brand { font-family: georgia, serif; }
	        .brand .first {
	            color: #ccc;
	            font-style: italic;
	        }
	        .brand .second {
	            color: #fff;
	            font-weight: bold;
	        }
	        *{margin:0;padding:0;list-style:none;}
			html{background-color:#E3E3E3; font-size:14px; color:#000; font-family:'微软雅黑'}
			.laydate-icon{width:220px;display:inline-block;}
			
			body {
				margin:0;
				padding:0;
				font:12px/15px "Helvetica Neue",Arial, Helvetica, sans-serif;
				color: #555;
				background:#f5f5f5 url('/static/img/bg.jpg');
			}
			
			a {color:#666;}
			
			#content {width:65%; max-width:690px; margin:6% auto 0;}
			
			
			table {
				overflow:hidden;
				border:1px solid #d3d3d3;
				background:#fefefe;
/*				width:70%;
*/				margin:5% auto 0;
				-moz-border-radius:5px; /* FF1+ */
				-webkit-border-radius:5px; /* Saf3-4 */
				border-radius:5px;
				-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
				-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
			}
			
			th, td {padding:18px 28px 18px; text-align:center; }
			
			th {padding-top:22px; text-shadow: 1px 1px 1px #fff; background:#e8eaeb;}
			
			td {border-top:1px solid #e0e0e0; border-right:1px solid #e0e0e0;}
			
			tr.odd-row td {background:#f6f6f6;}
			
			td.first, th.first {text-align:left}
			
			td.last {border-right:none;}
			
			/*
			Background gradients are completely unnecessary but a neat effect.
			*/
			
			td {
				background: -moz-linear-gradient(100% 25% 90deg, #fefefe, #f9f9f9);
				background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f9f9f9), to(#fefefe));
			}
			
			tr.odd-row td {
				background: -moz-linear-gradient(100% 25% 90deg, #f6f6f6, #f1f1f1);
				background: -webkit-gradient(linear, 0% 0%, 0% 25%, from(#f1f1f1), to(#f6f6f6));
			}
			
			th {
				background: -moz-linear-gradient(100% 20% 90deg, #e8eaeb, #ededed);
				background: -webkit-gradient(linear, 0% 0%, 0% 20%, from(#ededed), to(#e8eaeb));
			}
			
			tr:first-child th.first {
				-moz-border-radius-topleft:5px;
				-webkit-border-top-left-radius:5px; /* Saf3-4 */
			}
			
			tr:first-child th.last {
				-moz-border-radius-topright:5px;
				-webkit-border-top-right-radius:5px; /* Saf3-4 */
			}
			
			tr:last-child td.first {
				-moz-border-radius-bottomleft:5px;
				-webkit-border-bottom-left-radius:5px; /* Saf3-4 */
			}
			
			tr:last-child td.last {
				-moz-border-radius-bottomright:5px;
				-webkit-border-bottom-right-radius:5px; /* Saf3-4 */
			}
	    </style>
	    <link rel="shortcut icon" href="../assets/ico/favicon.ico">
	    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
	    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
	    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
	    <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
  </head>
  <body class="">  
  	{include file="public:header"}
  	{include file="public:left"}
    <div class="content">  
        <div class="header">
            <div class="stats">
    			<p class="stat"><span class="number" id="date"></span>日</p>
   	 			<p class="stat"><span class="number" id="month"></span>月</p>
    			<p class="stat"><span class="number" id="year"></span>年</p>
			</div>
        	<h1 class="page-title">商品管理</h1>
        </div>
       	<ul class="breadcrumb">
            <li><a href="index.html">Admin</a> <span class="divider">/</span></li>
            <li class="active">edit_product</li>
        </ul>
    	<div class="container-fluid">
        	<div class="row-fluid">
				<div style="float:right; margin-top: 1em;">
	    			<a href='{:url("admin/product/product_list")}' class="btn btn-danger">商品列表</a>				    
	    			<a href='{:url("admin/product/add_product")}' class="btn btn-success">添加商品</a>
	    			<a href='{:url("admin/product/pro_cates")}' class="btn btn-primary">分类列表</a>
	    			<a href='{:url("admin/product/add_pro_cates")}' class="btn btn-warning">添加分类</a>	    
				</div>
				<h3>&nbsp;&nbsp;&nbsp;修&nbsp;改&nbsp;商&nbsp;品</h3>
				<div id='calendar'>
					{assign name="i" value="1"}
					<table cellspacing="0px" border="1px" align="">
						<form action="" method="post" enctype="multipart/form-data">
							<tr>
								<td>分类父级:</td>
								<td>
									<select name="pc_id" id="pc_id" onblur="return iddd()">
										<option value="0">请选择分类</option>
										{foreach $cates as $v}
											<option value="{$v['id']}" {$data['pc_id']==$v['id']?"selected":""}>
												{$v['pc_name']}
											</option>
										{/foreach}
									</select>
									<span id="checkpc_id"></span>
								</td>
							</tr>
							<tr>
								<td width="65px">商品名称:</td>
								<td>
									<input type="text" name="pname" id="pname" value="{$data['pname']}" onblur="return pc_name()">
									<span id="checkid"></span>
								</td>
							</tr>
							<tr>
								<td>&nbsp;图&nbsp;片&nbsp;库:</td>
								<td>
									<input type="file" name="pimgs[]" multiple='multiple' style="display:none" id="show">
									<br>
									{foreach $pimgs as $k=>$vo}
										&nbsp;&nbsp;&nbsp;&nbsp;
										<img src="{$vo}" width="100px" id="{$k}" title="单击删除">&nbsp;&nbsp;&nbsp;&nbsp;
										&nbsp;&nbsp;&nbsp;&nbsp;
										<script type="text/javascript">
											$("img[id='{$k}']").click(function(){
												v=$("#{$k}").attr("src")
												$("this").attr("title","");
												console.log(v)
												$.post("{:url('admin/product/edit_product')}","type=src&src="+v+"&id="+{$data.id},function(res){
														location.reload() ;
												})
											})
										</script>
									{/foreach}
									<span id="add">添加图片</span>
									</td>
							</tr>
							<tr>
								<td>&nbsp;价&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;格:</td>
								<td>
									￥<input type="text" name="price" id="price" value="{$data['price']}" border="0px" onblur="return pc_price()">
									<span id="checkprice"></span>
								</td>
							</tr>
							<tr>
								<td>&nbsp;原&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;价:</td>
								<td>
									￥<input type="text" name="old_price" id="old" value="{$data['old_price']}" onblur="return oldd_price()">
									<span id="checkold">
								</td>
							</tr>
							<tr>
								<td>&nbsp;销&nbsp;售&nbsp;量:</td>
								<td>
									<input type="text" name="sales" value="{$data['sales']}" readonly>
									<span id="checksales"></span>	
								</td>
							</tr>
							<tr>
								<td>&nbsp;库&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;存:</td>
								<td>
									<input type="text" name="pnum" id="pnum" value="{$data['pnum']}" onblur="return pc_pnum()">
									<span id="checkpnum"></span>
								</td>
							</tr>
							<tr>
								<td>&nbsp;描&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;述:</td>
								<td>
									<input type="text" name="descrip" id="descrip" value="{$data['descrip']}" onblur="return pc_descrip()" >
									<span id="checkdescrip"></span>
								</td>
							</tr>
							<tr>
								<td>团购时间:</td>
								<td>
				                    <div class="demo3">
										<input type="text" name="mktime" class="laydate-icon" id="start" value="{$data['mktime']}" onblur="return _start()"><br>
										<input type="text" name="die_time" class="laydate-icon" id="end" value="{$data['die_time']}" onblur="return _end()">
									</div>
				                </td>
							</tr>
							<tr>
								<td>&nbsp;区&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;域:</td>
								<td>
									<select name="provinceID" id="provinceID"></select>
									<select name="cityID" id="cityID"></select>
								<td>
							</tr>
							<tr>
								<td>&nbsp;上&nbsp;下&nbsp;架:</td>
								<td>
									&nbsp;&nbsp;
									<input type="radio" name="ifshow" value="0" {$data['ifshow']==0?"checked":""}>下架
									&nbsp;&nbsp;&nbsp;&nbsp;
									<input type="radio" name="ifshow" value="1" {$data['ifshow']==1?"checked":""}>上架
								</td>
							</tr>
							<tr>
								<td><input type="hidden" name="id" value="{$data['id']}"></td>
								<td colspan="2" align="center"><input type="submit" name="sub" value="修改"></td>
							</tr>
						<form>
					</table>
				</div>                   
			    {include file="public:footer"}         
            </div>
        </div>
    </div>
    {load href="/static/js/bootstrap.js" /}
    <script type="text/javascript">
        $("[rel=tooltip]").tooltip();
        $(function() {
            $('.demo-cancel-click').click(function(){return false;});
        });
        var d=new Date
        $("#year").html(d.getFullYear())
        $("#month").html(d.getMonth()+1)
        $("#date").html(d.getDate())

        //日期
        //日期范围限制
		var start = {
		    elem: '#start',
		    format: 'YYYY-MM-DD',
		    min: laydate.now(), //设定最小日期为当前日期
		    max: '2099-06-16', //最大日期
		    istime: true,
		    istoday: false,
		    choose: function(datas){
		         end.min = datas; //开始日选好后，重置结束日的最小日期
		         end.start = datas //将结束日的初始值设定为开始日
		    }
		};
		var end = {
		    elem: '#end',
		    format: 'YYYY-MM-DD',
		    min: laydate.now(),
		    max: '2099-06-16',
		    istime: true,
		    istoday: false,
		    choose: function(datas){
		        start.max = datas; //结束日选好后，充值开始日的最大日期
		    }
		};
		laydate(start);
		laydate(end);
	
		//添加图片
		$("#add").click(function(){
			$("input[id=show]").attr("style","display:''")
		})


		//正则验证
		var checksub=''
		var pricepreg=/^\d{1,}$/
		var i=""
		//验证父级
		function iddd(){
				v=$.trim($("#pc_id").val())
				console.log(v)
				if (v==='0') {
					$("#checkpc_id").html("&nbsp;*请选择分类")
					$("#checkpc_id").css("color","red")
					i=false
				}else{
					$("#checkpc_id").html("&nbsp;√√√")
					$("#checkpc_id").css("color","green")
					i=true
				}
		}

		//验证开始时间不能为空
		function _start(){
				v=$.trim($("#start").val())
				console.log(v)
				if (v==='') {
					$("#checkstart").html("&nbsp;xxx")
					$("#checkstart").css("color","red")
					i=false
				}else{
					$("#checkstart").html("&nbsp;√√√")
					$("#checkstart").css("color","green")
					i=true
				}
		}
		
		//验证开始时间不能为空
		function _end(){
				v=$.trim($("#end").val())
				if (v==='') {
					$("#checkend").html("&nbsp;xxx")
					$("#checkend").css("color","red")
					i=false
				}else{
					$("#checkend").html("&nbsp;√√√")
					$("#checkend").css("color","green")
					i=true
				}
		}
		
		//验证商品名
		function pc_name(){	
			v=$.trim($("#pname").val())
			if(v==''){
				$("#checkid").html("&nbsp;*商品名不能为空")
				$("#checkid").css("color","red")
				i=false
			}else{
				$("#checkid").html("&nbsp;√√√")
				$("#checkid").css("color","green")
				i=true
			}
			// console.log(v)
		}
		//验证价格
		function pc_price(){
			v=$.trim($("#price").val())
			if(v==''){
				$("#checkprice").html("&nbsp;*价格不能为空")
				$("#checkprice").css("color","red")
				i=true
			}else if(!pricepreg.test(v)){
				$("#checkprice").html("&nbsp;*请填写数字")
				$("#checkprice").css("color","red")
				i=true
			}else{
				$("#checkprice").html("&nbsp;√√√")
				$("#checkprice").css("color","green")
				i=false
			}
		}
		//验证原价
		function oldd_price(){
			var v=$.trim($("#old").val())
			var v2=$.trim($("#price").val())
			// console.log(v2)
			if(v==''){
				$("#checkold").html("&nbsp;*价格不能为空")
				$("#checkold").css("color","red")
				i=false
			}else if(!pricepreg.test(v)){
				$("#checkold").html("&nbsp;*请填写数字")
				$("#checkold").css("color","red")
				i=false
			}else if(v2>v){
				$("#checkold").html("&nbsp;*请重新填写原价")
				$("#checkold").css("color","red")
				i=false
			}else{
				$("#checkold").html("&nbsp;√√√")
				$("#checkold").css("color","green")
				i=true
			}
		}
		//验证库存
		function pc_pnum(){
			var v=$.trim($("#pnum").val())
			// console.log(v)
			if(v==''){
				$("#checkpnum").html("&nbsp;*库存不能为空")
				$("#checkpnum").css("color","red")
				i=false
			}else if(!pricepreg.test(v)){
				$("#checkpnum").html("&nbsp;*请填写数字")
				$("#checkpnum").css("color","red")
				i=false
			}else{
				$("#checkpnum").html("&nbsp;√√√")
				$("#checkpnum").css("color","green")
				i=true
			}
		}
		//验证描述
		function pc_descrip(){
			v=$.trim($("#descrip").val())
			// console.log(v.length)
			if(v==''){
				$("#checkdescrip").html("&nbsp;*商品名不能为空")
				$("#checkdescrip").css("color","red")
				i=false
			}else if(v.length>50){
				$("#checkdescrip").html("&nbsp;*描述仅50字")
				$("#checkdescrip").css("color","red")
				i=false
			}
			else{
				$("#checkdescrip").html("&nbsp;√√√")
				$("#checkdescrip").css("color","green")
				i=true
			}
		}
		function check(){
			iddd();
			pc_name();
			pc_price();	
			oldd_price();
			pc_pnum();
			pc_descrip()
			_start();
			_end();
			return i;
		}

		window.onload=function(){
			//获取省
			$.post("{:url('admin/product/edit_product')}","provc="+{$data.provinceID}+"&type=province",function(res){
				getprovince(res)
			})
		}
		function getprovince(res){
			provid=$("#provinceID")
			res=eval("("+res+")");
			if(res.status==1){
				provinceID.innerHTML=res.data;
			}
			//根据省获取市
			$.post("{:url('admin/product/edit_product')}","cit="+{$data.cityID}+"&type=city&provinceID="+provinceID.value,function(res){
					getcity(res)
			})
		}

		$("#provinceID").change(function(){
			$.post("{:url('admin/product/edit_product')}","cit="+{$data.cityID}+"&type=city&provinceID="+provinceID.value,function(res){
					getcity(res)
			})
		})

		function getcity(res){
			res=eval("("+res+")");
			if(res.status==1){
				cityID.innerHTML=res.data;
			}
		}

    </script>
  </body>
</html>


